/* eslint-disable jsx-a11y/alt-text */
import React from "react";
import { TabBar } from "antd-mobile";
import { withRouter } from "react-router-dom";
import "./hjTabBar.less";
class HjTabBar extends React.Component {
  constructor(props) {
    super(props);
    this.state = {};
  }

  static defaultProps = {
    selectedTab: "",
  };
  render() {
    return (
      <div className="tabbox ft-14">
        <div className="tabbar">
          <TabBar
            unselectedTintColor="#888"
            tintColor="#19BC9B"
            barTintColor="white"
          >
            <TabBar.Item
              title="首页"
              key="首页"
              icon={
                // eslint-disable-next-line jsx-a11y/alt-text
                <img
                  className="img"
                  src={require("../images/tabBar/icon-index.png")}
                />
              }
              selectedIcon={
                <img
                  className="img"
                  src={require("../images/tabBar/icon-index-select.png")}
                />
              }
              selected={this.props.selectedTab === "index"}
              onPress={() => {
                this.props.history.replace("/home");
              }}
              data-seed="logId"
            ></TabBar.Item>
            <TabBar.Item
              icon={
                <img
                  className="img"
                  src={require("../images/tabBar/icon-task.png")}
                />
              }
              selectedIcon={
                <img
                  className="img"
                  src={require("../images/tabBar/icon-task-select.png")}
                />
              }
              title="任务"
              key="任务"
              selected={this.props.selectedTab === "task"}
              onPress={() => {
                this.props.history.replace("/task");
              }}
            ></TabBar.Item>
            <TabBar.Item
              icon={
                <img
                  className="img"
                  src={require("../images/tabBar/icon-mine.png")}
                />
              }
              selectedIcon={
                <img
                  className="img"
                  src={require("../images/tabBar/icon-mine-select.png")}
                />
              }
              title="我的"
              key="我的"
              selected={this.props.selectedTab === "mine"}
              onPress={() => {
                this.props.history.replace("/mine");
              }}
            ></TabBar.Item>
          </TabBar>
        </div>
      </div>
    );
  }
}
export default withRouter(HjTabBar);
